<template>
	<view>
		<view class="title bg-white flex align-center">
			<image src="/static/icon.png" mode=""></image>
			<view class="text">
				您共有<text>{{list.length}}个</text>商户
			</view>
		</view>
		<scroll-view scroll-y="true" v-if="list.length != 0">
			<view v-for="(item,index) in list" :key="index" class="item flex-cb bg-white">
				<view class="user flex-cb">
					<image :src="item.avatar?url+item.avatar:'/static/logo.png'" mode=""></image>
					<view class="name">
						<view class="nichen">{{item.phone}}</view>
						<view class="name_text">手机</view>
					</view>
				</view>
				<view class="time">
					<view class="ymd">{{item.created_at}}</view>
					<view class="zcsj">注册时间</view>
				</view>
			</view>
		</scroll-view>
		<nodata v-else />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				url:'',
				list:[]
			};
		},
		onLoad() {
			this.url = this.$base
			this.$api.agentsMerchants().then(res=>{
				console.log(res);
				this.list = res.data
				for (let i = 0; i < this.list.length; i++) {
					this.list[i].created_at = this.list[i].created_at.slice(0,10)
					this.list[i].phone = this.$utils.phoneAk(this.list[i].phone)
				}
			})
		}
	}
</script>

<style lang="less">
.title{
	margin: 20rpx 0;
	padding: 25rpx 30rpx;
	height: 80rpx;
	image{
		width: 30rpx;height: 30rpx;margin-right:10rpx ;
	}
	.text{
		font-size: 32rpx;
		color: #666666;
		text{
			color: #333;
		}
	}
}
scroll-view{
	height: calc(100vh - 120rpx);
	overflow: hidden;
	.item{
		height: 140rpx;padding: 30rpx;
		margin-bottom: 20rpx;
		.user{
			font-size: 28rpx;
			color: #333333;
			image{
				width: 80rpx;height: 80rpx;border-radius: 50%;margin-right: 10rpx;
			}
			.name{
				.nichen{
					height: 26rpx;
					
				}
				.name_text{
					margin-top: 18rpx;
					color: #999;
				}
			}
		}
		.time{
			.zcsj{
				margin-top: 18rpx;
				color: #999999;
				
			}
		}
	}
}
</style>
